import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'dva'
import UserList from './List'
import Modals from './Modal'
import { message,Modal} from 'antd';
const confirm = Modal.confirm;

function User({location, dispatch, customerInformation, loading}) {

  const { curItem, modalVisible, modalType, record, selectedRowKeys} = customerInformation
  const modalProps = {
    item: modalType === 'create' ? {} : curItem,
    visible: modalVisible,
    maskClosable: false,
    title: `${modalType === 'create' ? '新增客户信息' : '客户信息'}`,
    width: '80%',
    wrapClassName: 'vertical-center-modal',
    onOk (data) {
      //console.log('新增>>>',data);
      dispatch({
        type: `customerInformation/${modalType}`,
        payload: data,
      })
    },
    onCancel () {
      dispatch({
        type: 'customerInformation/hideModal',
      })
    },
  }
  function onDeleteItem(id) {
    dispatch({
      type: 'customerInformation/delete',
      payload: {id}
    })
  }

/**
 * 选中删除
 * @author 李爽
 * @version [version]
 */
  function onDeleteItem1(id) {
    //console.log('这里');
    if(!id){//未定义状态判断
      message.warning('请至少选中一条数据！');
      return;
    }else if(record.length > 0){
      confirm({
        title: '您确定要删除吗?',
        onOk () {
        dispatch({
          type: 'customerInformation/delete',
          payload: {id}
        })
      },
    })

    }else{
      message.warning('请至少选中一条数据！');
      return;
    }
  }

  //批量删除
  function onDeleteItem(id) {

    //console.log('批量删除');

    dispatch({
      type: 'customerInformation/deleteBatch',
      payload: {id}
    })

  }

/**
 * 查看客户
 * [type description]
 * @type {String}
 */
 function onLock() {
   if(!record){//未定义状态判断
     message.warning('请选中一条数据！');
     return;
   }else if(record.length == 1){
     dispatch({
       type: 'customerInformation/showModal',
       payload: {
         modalType: 'lock',
         curItem: record[0],
       },
     })
   }else {
     message.warning('请选中一条数据！');
     return;
   }
 }

  /**
   * 修改
   * @author 李爽
   * @version [version]
   */
  function onEditItem(item) {

    dispatch({
      type: 'customerInformation/showModal',
      payload: {
        modalType: 'update',
        curItem : item
      }
    })
  }

/**
 * 选中修改
 * @author 李爽
 * @version [version]
 */
 function onEditItem1() {
   if(!record){//未定义状态判断
     message.warning('请选中一条数据！');
     return;
   }else if(record.length == 1){//只有选中一条数据才进行修改
     dispatch({
       type: 'customerInformation/showModal',
       payload: {
         modalType: 'update',
         curItem: record[0],
       },
     })
   }else {
     message.warning('请选中一条数据！');
     return;
   }
 }

  function onStatusItem(item) {
    dispatch({
      type: 'customerInformation/updateStatus',
      payload: {
        curItem: item
      }
    })
  }

  function onDeleteBatch(ids) {
    dispatch({
      type: 'customerInformation/deleteBatch',
      payload: { ids }
    })
  }

  //Button作废
  function onInvalid1(){
    if(!record){//未定义状态
      message.warning('请至少选中一条数据！',1);
      return;
    }else if(record.length >0){//只有选中一条数据才进行作废
      confirm({
        title: '您确定要对选中记录进行撤户吗?',
        onOk () {
          dispatch({
          type: 'customerInformation/onInvalid',
          payload: selectedRowKeys
        })
        },
      })
    }else{
      message.warning('请至少选中一条数据！',1);
      return;
    }
  }

  //菜单作废
  function onInvalid(toInvalid){
    confirm({
      title: '您确定要对选中记录进行撤户吗?',
      onOk(){
        dispatch({type: 'customerInformation/onInvalid',
        payload: {toInvalid}})
      }
    })
  }

  /**
   * 新增
   * @return {[type]} [description]
   */
  function onCreate () {

    dispatch({
      type: 'customerInformation/showModal',
      payload: {
        modalType: 'create',
      },
    })
  }

  function onSearch(values){
    dispatch({
      type: 'customerInformation/search',
      payload: values
    })
  }

  const listProps = {
    customerInformation,
    loading,
    location,
    onDeleteItem,
    onDeleteItem1,
    onEditItem,
    onEditItem1,
    onStatusItem,
    onDeleteBatch,
    onInvalid1,
    onInvalid,
    onCreate,
    onSearch,
    dispatch,
    onLock
  }

  return (
    <div className='content-inner'>

      <UserList {...listProps}/>
      {modalVisible && <Modals {...modalProps} />}
    </div>
  );
}

User.propTypes = {
  customerInformation: PropTypes.object,
  location: PropTypes.object,
  dispatch: PropTypes.func
};

function mapStateToProps({ customerInformation }){
  return { customerInformation }
}

export default connect(mapStateToProps)(User);
